<template>
  <view>
    <!-- 动态加载组件 -->
    <component :is="currentComponent" v-if="isLoaded" />
    <view v-else>
      <text>加载中...</text>
    </view>
  </view>
</template>

<script>
import ComponentA from '@/components/ComponentA.vue';
import ComponentB from '@/components/ComponentB.vue';

export default {
  data() {
    return {
      type: 'A', // 默认值
      isLoaded: false, // 是否已加载完成
    };
  },
  computed: {
    // 根据 type 的值返回对应的组件
    currentComponent() {
      return this.type === 'A' ? ComponentA : ComponentB;
    },
  },
  onLoad() {
    // 从服务器请求类型
    this.fetchTypeFromServer();
  },
  methods: {
    async fetchTypeFromServer() {
      try {
        // 发起网络请求（示例使用 uni.request）
        const res = await uni.request({
          url: 'http://www.zbuav.com/api/uavform/getdata', // 替换为你的接口地址
          method: 'GET',
        });

        // 假设服务器返回的数据格式为 { type: 'A' } 或 { type: 'B' }
		console.log(res[1],res[1].data.data);
		let backs=res[1].data ;
		
        if (backs.data && backs.data.type) {
          this.type = backs.data.type; // 更新 type
        }
      } catch (error) {
        console.error('请求失败:', error);
      } finally {
        this.isLoaded = true; // 标记为已加载完成
      }
    },
  },
};
</script>